<template>
  <el-tree :data="menus" :props="defaultProps" node-key="catId" ref="menuTree" @node-click="nodeClick"></el-tree>
</template>

<script>
import categoryService from '@/api/product/category'

export default {
  name: "attrgroup",
  data() {
    return {
      expandKeys: [],
      menus: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      }
    }
  },
  methods: {
    getMenus() {
      categoryService.listTree().then(({data}) => {
        console.log('获取到菜单数据', data.data)
        this.menus = data.data
      })
    },
    nodeClick(data, node, component) {
      this.$emit('tree-node-click', data, node, component)
    }
  },
  // 创建完成,可以访问this对象
  created() {
    this.getMenus()
  },
  // 挂载完成，可以访问dom元素
  mounted() {
  },

  watch: {},
  calculate(){},
  // 创建之前
  beforeCreate() {
  },
  // 挂载之前
  beforeMount() {
  },
  // 更新之前
  beforeUpdate() {
  },
  // 更新之后
  updated() {
  },
  // 销毁之前
  beforeDestroy() {
  },
  // 销毁之后
  destroyed() {
  },
  // 如果页面有keep-alive缓存功能,这个函数会触发
  activated() {
  },
}
</script>

<style scoped>

</style>
